import React from 'react';
import Topbar from '../../components/Topbar/Topbar';
import Say from '../../components/Say/Say'
import Bottombar from '../../components/Bottombar/Bottombar'
import axios from 'axios';
import moment from 'moment';

class Mylike extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            likedata: [],
            liketimedata:[],
            saydata: [],
            userid:localStorage.getItem('userid'),
        };
    }

    async componentDidMount() {
        //获得用户点赞的sayid
        await axios.get(`https://www.prebeauty.work/saylike/userid=${this.state.userid}`)
            .then((res) => {
                this.setState({
                    likedata: res.data
                })
                console.log(this.state.likedata)    
            })
            .catch((err) => {
                console.log(err);
            })  
        //根据sayid在动态表找到详细信息
        for(var i=0; i<this.state.likedata.length; i++){
            this.setState({
                liketimedata:[...this.state.liketimedata, parseInt(this.state.likedata[i].time)]
            })
            console.log(this.state.likedata[i].sayid)
            var likesayid = this.state.likedata[i].sayid
            await axios.get(`https://www.prebeauty.work/saying/sayid=${likesayid}`)
            .then((res) => {
                console.log(res)
                this.setState({
                    saydata: [...this.state.saydata, res.data[0]]
                })
                console.log(this.state.saydata)
            })
            .catch((err) => {
                console.log(err);
            })
        }
        console.log(this.state.liketimedata)
    }

    goadd() {
        this.props.history.push('/Sharefabu')
    }

    render() {
        return (
            <div className="mylike">
                <Topbar name="我的点赞" color="#95D2AA" />
                {
                (this.state.likedata.length == 0) ? <div style={{minHeight:'500px',paddingTop:'70px',paddingLeft:'10%',fontSize:'19px'}}>你还没有点赞，快去交流圈看看吧！</div> :
                    <div style={{minHeight:'560px'}}>
                        {
                        (!this.state.saydata) ? null : this.state.saydata.map((item, index) => {
                            if(item){
                            return (
                                <div style={{marginTop:'20px'}} key={index}>
                                    <div style={{width:'100%',height:'40px',backgroundColor:'white',borderBottom:'1px solid #eeeeee'}}>
                                        <span style={{marginLeft:'5%',fontSize:'16px',position:'relative',top:'10px',color:'#236E3D'}}>
                                            你在{moment(this.state.liketimedata[index]).format('MM月DD日 HH:mm')}点赞了
                                        </span>
                                    </div> 
                                    <div 
                                    onClick={() => {
                                        this.props.history.push('/SayDetail',{
                                                time: item.time,
                                                title: item.title,
                                                content: item.jianjie,
                                                imgsrc: item.imgsrc,
                                                likenum: item.likenum,
                                                commentnum: item.commentnum,
                                                sayid: item.sayid,
                                                userid:this.state.userid,
                                                confimg:this.state.confimg,   
                                    })
                                }}>
                                    <Say 
                                        time={item.time} 
                                        title={item.title}
                                        content={item.jianjie}
                                        imgsrc={item.imgsrc} 
                                        likenum={item.likenum} 
                                        commentnum={item.commentnum}
                                        sayid={item.sayid}
                                        userid={item.userid}
                                    />
                                </div>
                                </div>
                            )
                            }
                        })
                        }
                    </div>
                }
             
                {/* 页尾 */}
                <Bottombar />
            </div>
        )
    }
}

export default Mylike